<template>
    <!-- <div class="the-form">theForm</div> -->
    <form-create
        :value="value"
        @value:update="handleValueChange"
        :options="formOptions"
    />
</template>
<script>
import { defaultOptions } from './options'
import { merge } from '@/utils'
export default {
    name: 'the-form',
    model: {
        prop: 'value',
        event: 'change',
    },
    props: {
        options: { type: Object, default: () => ({}) },
    },
    data() {
        return {}
    },
    computed: {
        formOptions: () => {
            return merge(defaultOptions, this.options)
        },
    },
    watch: {},
    methods: {
        handleValueChange(val) {
            console.log('handleValueChange,', val)
        },
    },
}
</script>
<style lang="scss" scoped>
.the-form {
}
</style>
